import QtQuick 2.2

FocusScope {
    id: scope

    //FocusScope needs to bind to visual properties of the children
    property alias color: rectangle.color
    property alias text : displayText.text
    x: rectangle.x
    y: rectangle.y
    width: rectangle.width
    height: rectangle.height

    Rectangle {
        id: rectangle
        //property alias text : displayText.text

        /* set the default values for the LineEdit */

        // when active there should be an orange border
        border.color: "orange"
        border.width: scope.focus ? 5 : 0

        // Properties that are passed in to this Item
        width: parent.width
        height: parent.height

        // Properties that are given a value
        radius: 10
        focus: false

        Text {
            id: displayText
            anchors {
                left: parent.left;
                verticalCenter: parent.verticalCenter;
                margins: 1

            }
             //wrapMode:Text.Wrap
            // The width must be set for eliding to work properly
            width: parent.width - 6

            // Text properties
            font.pixelSize: parent.height * .6;  // Text should fit in the the field
            elide: Text.ElideRight   // Scroll the text to the left when it is longer
            // than the width of the LineEdit
            color: "#343434"
            smooth: true;           // Use font smoothing
            //font.bold: true         // font is bold
            font.family: "WenQuanYi Micro Hei Mono"
        }
    }
    MouseArea { anchors.fill: parent; onClicked: { scope.focus = true } }
}
